<template>
	<div>
		<activity-ad-swiper :type="AdPositionType.sports" />
		<sports-nav :tab="tab" class="mt-1"></sports-nav>
		<router-view></router-view>
		<comming-soon></comming-soon>
		<!-- <sports-swiper :tab="tab" class="my-2" /> -->
		<!-- <live-big-wins defaultTab="sport" /> -->
	</div>
</template>
<script lang="ts" setup>
import { computed } from 'vue'
import { useRoute } from 'vue-router'
// import { SportsSwiper } from '@/components/sports'
import { ActivityAdSwiper } from '@/components/activity'
import CommingSoon from '@/components/app/app-comming-soon/index.vue'
import { AdPositionType } from '@/enums'
import SportsNav from './sports-nav.vue'
// import LiveBigWins from '@/views/slots/components/live-big-wins/index.vue'

const route = useRoute()

const tab = computed(() => {
	if (route.name === 'sports') {
		return 'home'
	} else if (route.path === 'sports-live') {
		return 'live'
	} else {
		return route.params.id as string
	}
})
</script>
